import {nextTick} from 'vue';
// tslint:disable-next-line:no-var-requires
// @ts-ignore
import variables from '@/assets/style/ch-varibles.scss';

class Properties {
  public property!: string;
  public value!: string | null;
}

class ScssVariables {
  public themeColor!: string;
}

const scssVariables: ScssVariables = {
  themeColor: variables.themecolorVaraible,
};

async function changeScssVariable(properties: Properties | Properties[]): Promise<void> {
  await nextTick(() => {
    const n: Properties[] = [];
    if (properties instanceof Array) {
      n.push(...properties);
    } else {
      n.push(properties);
    }
    n.forEach((p) => document.getElementsByTagName('body')[0].style.setProperty(p.property, p.value));
  });
}

class ThemeUtil {
  public changeThemeColor!: (a: string) => void;
}

const changeThemeColor: (a: string) => void = async (color: string) => await changeScssVariable({
  property: scssVariables.themeColor,
  value: color,
});
export const themeUtil: ThemeUtil = {
  changeThemeColor,
};

